<template>
	<el-container>
		<el-header>
			<Header></Header>
		</el-header>
		<el-container>
			<el-aside width="200px">
				<Aside></Aside>
			</el-aside>
			<el-main>
				<h3 style="text-align:center;">预览会员</h3>
				<table width="98%" border class="table table-bordered">
					<tbody>
						<tr>
							<td align="right">ID</td>
							<td>{{form.userid}}</td>
						</tr>
						<tr>
							<td align="right">所属组</td>
							<td v-html="form.groupid"></td>
						</tr>
						<tr>
							<td align="right">真实姓名</td>
							<td>{{form.truename}}</td>
						</tr>
						<tr>
							<td align="right">电话</td>
							<td>{{form.telephone}}</td>
						</tr>
						<tr>
							<td align="right">QQ</td>
							<td>{{form.qq}}</td>
						</tr>
						<tr>
							<td align="right">手机</td>
							<td>{{form.mobile}}</td>
						</tr>
						<tr>
							<td align="right">邮箱</td>
							<td>{{form.email}}</td>
						</tr>
						<tr>
							<td align="right">地址</td>
							<td>{{form.address}}</td>
						</tr>
					</tbody>
				</table>
			</el-main>
		</el-container>
		<el-footer>
			<Footer></Footer>
		</el-footer>
	</el-container>
</template>

<script>
	export default {
		async onLoad(query) {
			let userid = parseInt(query.userid);
			const data = await this.$axios.post("/api/member/preview", {
				userid: userid,
				formated: 1
			});
			this.form = data.data;
		},
		data() {
			return {
				form: {}
			};
		},
		async mounted() {

		},
		methods: {}
	};
</script>

<style scoped>
	.el-header,
	.el-footer {
		background-color: #b3c0d1;
		color: #333;
		text-align: center;
		line-height: 60px;
	}

	.el-aside {
		background-color: #d3dce6;
		color: #333;
		text-align: center;
	}

	.el-main {
		
		color: #333;
	}
</style>
